<template>
	<!-- 新增弹框-->
	<u-popup mode="bottom" :show="showNew">
		<h3 class="title">费用报销信息填写</h3>
		<view class="" style="max-height: 50vh; overflow-y: auto;">
				<u-form :model="basicForm" :rules="rules" labelPosition="top" ref="form" labelWidth="auto"
				  :labelStyle="{
				  	fontSize: '14px',
				  	color: '#B2B2B2',
				  	lineHight: '20px'
				  }"
				>
				  <view class="basic-style">
					<template v-if="isRelProject=='1'">
					<u-form-item label="项目名称:" prop="projectId" required>
						<h-select-project-input-popup
						  :disabled="(!teamId&&!companyId) || formBpm"
						  ref="projectSelect"
						  v-model="basicForm.projectId"
						  :signUnit="companyId"
							:teamId="teamId"
						  @realChange='proChange'
						  style="width: 100%"
						  placeholder="请选择项目名称"
						  border="surround"
						  suffixIcon="arrow-down-fill"
						  :suffixIconStyle="{ color: '#B2B2B2' }"/>
					</u-form-item>
					<u-form-item label="项目编号" prop="projectCode">
						<u--input disabled placeholder="请输入项目编号" v-model="basicForm.projectCode"></u--input>
					</u-form-item>
					<u-form-item label="业绩归属年度:" prop="performanceAttributionYear">
						<u-input 
							disabled 
							v-model="basicForm.performanceAttributionYear"
							border="surround"
							suffixIcon="arrow-down-fill"
							:suffixIconStyle="{ color: '#B2B2B2' }"  
							placeholder="请选择业绩归属年度"
						/>
					</u-form-item>
					<u-form-item label="合同名称:" prop="relContractId">
						<h-select-contract-manager-input-popup
						  showName="1"
						  htlx="2"
							:allowClear="true"
							isCategoryType="2"
						  :disabled="!basicForm.projectId || formBpm"
						  :projectId="basicForm.projectId"
						  :signUnit="basicForm.projectId?null:companyId"
						  :jytd="basicForm.projectId?null:teamId"
						  v-model="basicForm.relContractId"
							@realChange='contractChange'
						  placeholder="请选择合同"
						  border="surround"
						  style="width: 100%"
						  suffixIcon="arrow-down-fill"
						  :suffixIconStyle="{ color: '#B2B2B2' }"/>
					</u-form-item>
					<u-form-item label="任务分类:" prop="taskCategory" required>
						<h-select-task-input-popup
							:disabled="!basicForm.projectId || formBpm"
						  :projectId="basicForm.projectId"
						  v-model="basicForm.taskCategory"
						  class="w-100"
						  placeholder="请选择任务分类"
						  searchPlaceholder="请输入任务分类"
						  border="surround"
						  suffixIcon="arrow-down-fill"
							:isFlowCancel="'running'"
							:api="erpOmcProjectTaskAllList"
						  :suffixIconStyle="{ color: '#B2B2B2' }"
						  @realChange="taskCategoryChange"/>
					</u-form-item>
					<!-- <u-form-item label="任务说明:" prop="taskName">
						<u-input disabled v-model="basicForm.taskName" placeholder="任务说明"/>
					</u-form-item> -->
					</template>
				    <u-form-item label="费用大类:" prop="bigCategory" required>
						<selectListTag
							class="w-100"
							v-model="basicForm.bigCategory"
							objectField="basicForm.bigCategory"
							placeholder="请选择大类"
							:dictName='dictName'
							border="surround"
							suffixIcon="arrow-down-fill"
							:suffixIconStyle="{ color: '#B2B2B2' }" 
							@change='changeBigCategory'/>
				    </u-form-item>
				    <u-form-item label="费用小类:" prop="smallCategory" required>
						<selectListTag
							class="w-100"
							:disabled="basicForm.bigCategory?false:true"
							:dictName='basicForm.bigCategory'
							v-model="basicForm.smallCategory"
							placeholder="请选择小类"
							border="surround"
							suffixIcon="arrow-down-fill"
							:suffixIconStyle="{ color: '#B2B2B2' }" 
							@change='changeSmallCategory'/>
				    </u-form-item>
					<u-form-item label="发票类型:" prop="isSpecial" required>
						<h-select-input-tag
						  class="w-100"
						  v-model="basicForm.isSpecial"
						  objectField="basicForm.isSpecial"
						  placeholder="请选择发票类型"
						  border="surround"
							suffixIcon="arrow-down-fill"
							:suffixIconStyle="{ color: '#B2B2B2' }" 
						  dictName="cost_invoice_type"
						  @change='isSpecialChange'/>
					</u-form-item>
					<u-form-item label="报销金额(元):" prop="amount" required>
						<h-money-input placeholder="请输入报销金额" v-model='basicForm.amount' @blur='inputAmount' ></h-money-input>
					</u-form-item>
					 <u-form-item label="税费金额(元):" prop="taxation" :required="!isSpecialDisabled">
						<h-money-input placeholder="请输入税费金额" :max="basicForm.amount" :disabled="isSpecialDisabled" @blur='inputAmount' v-model='basicForm.taxation'></h-money-input>
					</u-form-item>
				    <u-form-item label="未税金额(元):" prop="untaxedAmount">
				      <u-input type='number' disabled v-model="basicForm.untaxedAmount" v-number-normal placeholder="请输入未税金额"/>
				    </u-form-item>
						<u-form-item label="税率(%):" prop="taxRate" :required="!isTaxRateDisabled">
							<h-number-input
								placeholder="请输入税率"
								v-model="basicForm.taxRate"
								:disabled="isTaxRateDisabled"
								:digit="0"
								:max="99999999"
								:min="0"
							></h-number-input>
						</u-form-item>
				  </view>
				</u-form>
		</view>
		<view class="space-x-1 px-1 btn_position">
			<u-button type="primary"  :plain="true"  text="关闭" @click="showNew=false"></u-button>
			<u-button type="primary" text="保存" @click="onSave"></u-button>
		</view>
		<view style="height: 100rpx;"></view>
	</u-popup>
</template>

<script>
	import selectListTag from './select-list-tag.vue'
	import { erpOmcProjectTaskAllList } from '@/api/index.js'
	export default {
		components:{ selectListTag },
		data() {
			return {
				erpOmcProjectTaskAllList,
				isSpecialDisabled:false,//发票类型
				isTaxRateDisabled:false,//发票类型
				smallCategoryList:[],
				showNew:false,
				basicForm:{
					id:'',
					projectId:'',//项目
					projectName:'',
					relContractId:'',//合同
					relContractName:'',
					taskCategory:'',//任务分类
					// taskName:'',//任务说明
					// performanceAttributionYear:'', //业绩归属年度
					/* ------ */
					bigCategory:"",//大类
					bigCategoryName:'',
					smallCategory:"",//小类
					smallCategoryName:'',
					isSpecial:'',//发票类型
					isSpecial_dictText:'',
					amount:'',//报销金额(元)
					taxation:0.00,//税费金额(元)
					untaxedAmount:'',//未税金额(元)
					taxRate: 0, // 税率
				},
				rules:{
					taskCategory:[{ required: true, message: '请选择任务分类!', trigger: 'change' }],
					projectId:[{ required: true, message: '请选择项目!', trigger: 'change' }],
					bigCategory:[{ required: true, message: '请选择大类!', trigger: 'change' }],
					smallCategory: [{ required: true, message: '请选择小类!', trigger: 'change' }],
					isSpecial: [{ required: true, message: '请选择发票类型!', trigger: 'change' }],
					amount: [
						{ required: true, message: '请填写报销金额!', trigger: 'blur' },
						{ pattern: /^(?!0\.00)(?!0$)([1-9]\d*|0)(\.\d{2})?$/, message: '请输入正确的金额!',trigger: ['blur', 'change']}
					],
					taxRate: [{ required: true, message: '请填写税率!', trigger: 'blur' }],
				}
			}
		},
		props: {
			companyId:{
				type: String,
				default: ''
			},
			teamId:{
				type: String,
				default: ''
			},
			isRelProject:{
				type: String,
				default: '1'
			},
			dictName: {
				type: String,
				default: ''
			},
			//表单模式：true流程表单 false普通表单
			formBpm: {
				type: Boolean,
				default: false,
				required: false
			},
		},
		mounted() {
	
		},
		methods: {
			// 改变项目
			proChange(data){
				this.$set(this.basicForm, 'projectCode', data?.finalNo || '')
				this.$set(this.basicForm, 'performanceAttributionYear', data?.year || '')
				if (data) {
					this.basicForm.projectName=data.projectName || '' // 项目名称
					// this.basicForm.performanceAttributionYear=data.year
					if(this.basicForm.taskCategory){
						// this.basicForm.taskName = ''
					  this.$set(this.basicForm,"taskCategory",'');
						this.$set(this.basicForm, 'taskCategory_dictText', '') // 任务分类名称
					}
					if(this.basicForm.relContractId){
					  this.$set(this.basicForm,"relContractId",'');
						this.$set(this.basicForm, 'relContractId_dictText', '') // 合同名称
					}
				} else {
					this.basicForm.projectName= '' // 项目名称
					
					// this.basicForm.performanceAttributionYear= ''
					if(this.basicForm.taskCategory){
						// this.basicForm.taskName = ''
					  this.$set(this.basicForm,"taskCategory",'');
						this.$set(this.basicForm, 'taskCategory_dictText', '') // 任务分类名称
					}
					if(this.basicForm.relContractId){
					  this.$set(this.basicForm,"relContractId",'');
						this.$set(this.basicForm, 'relContractId_dictText', '') // 合同名称
					}
				}
			},
			taskCategoryChange (data) {
				if (data) {
					// this.basicForm.taskName = data.taskDescription
					this.$set(this.basicForm, 'taskCategory_dictText', data.categoryName) // 任务分类名称
				} else {
					// this.basicForm.taskName = ''
					this.$set(this.basicForm, 'taskCategory_dictText', '') // 任务分类名称
				}
			},
			// 切换大类
			changeBigCategory(pcode,item){
				this.basicForm.bigCategoryName=item.title
				if(this.basicForm.smallCategory){
					this.$set(this.basicForm,"smallCategory",'');
				}
			},
			// 切换小类
			changeSmallCategory(pcode,item){
				this.basicForm.smallCategoryName=item.title
				this.$set(this.basicForm,"checkPosition",item.checkPosition);
			},
			// 发票类型验证规则
			specialRules(){
				if(this.basicForm.isSpecial == '0'){
					// 普票：税费和税率默认为0，发起人不可编辑和修改（流程中也不可修改
					this.$delete(this.rules, 'taxation');
					this.$delete(this.rules, 'taxRate');
					this.isSpecialDisabled=true;
					this.isTaxRateDisabled=true;
				}else if (this.basicForm.isSpecial == '1'){
					// 专票：税费和税率为必填，发起人可编辑和修改 （税率计算公式：税费金额/未税金额取整，流程中都可修改）
					this.$set(this.rules, 'taxRate', [{ required: true, message: '请输入正确的税率!'}]);
					this.$set(this.rules, 'taxation', [{ required: true,pattern: /^(?!0\.00)(?!0$)([1-9]\d*|0)(\.\d{2})?$/, message: '请输入正确的金额!'}]);
					this.isSpecialDisabled=false;
					this.isTaxRateDisabled=false;
				} else {
					// 其他或者不填：税费金额必填默认为0，发起人可修改，税率默认为0，发起人不可编辑和修改（流程中可以修改税费金额，不可修改税率）
					this.$delete(this.rules, 'taxRate');
					this.$set(this.rules, 'taxation', [{ required: true,pattern: /^(([1-9][0-9]*)|([0]\.\d{0,2}|[1-9][0-9]*\.\d{0,2}))$/, message: '请输入正确的金额!'}]);
					this.isSpecialDisabled=false;
					this.isTaxRateDisabled=true;
				}
			},
			// 切换发票类型
			isSpecialChange(value){
				if(value == '0'){ // 普票：税费和税率默认为0，发起人不可编辑和修改（流程中也不可修改）
					this.$set(this.basicForm, 'taxation',0);
					this.$set(this.basicForm, 'taxRate',0);
					this.$delete(this.rules, 'taxation');
					this.$delete(this.rules, 'taxRate');
					this.$refs.form.clearValidate('taxation');
					this.$refs.form.clearValidate('taxRate');
					this.isSpecialDisabled=true;
					this.isTaxRateDisabled=true;
					this.basicForm.isSpecial_dictText='普票'
				}else if (value == '1'){ // 专票：税费和税率为必填，发起人可编辑和修改 （税率计算公式：税费金额/未税金额取整，流程中都可修改）
					this.$refs.form.clearValidate('taxation');
					this.$set(this.basicForm, 'taxation','');
					this.$set(this.basicForm, 'taxRate','');
					this.$set(this.rules, 'taxRate', [{ required: true, message: '请输入正确的税率!'}]);
					this.$set(this.rules, 'taxation', [{ required: true,pattern: /^(?!0\.00)(?!0$)([1-9]\d*|0)(\.\d{2})?$/, message: '请输入正确的金额!'}]);
					this.isSpecialDisabled=false
					this.isTaxRateDisabled=false
					this.basicForm.isSpecial_dictText='普票'
				} else { // 其他或者不填：税费金额必填默认为0，发起人可修改，税率默认为0，发起人不可编辑和修改（流程中可以修改税费金额，不可修改税率）
					this.$set(this.basicForm, 'taxation',0)
					this.$set(this.basicForm, 'taxRate',0);
					this.$delete(this.rules, 'taxRate');
															
					this.$set(this.rules, 'taxation', [{ required: true,pattern: /^(([1-9][0-9]*)|([0]\.\d{0,2}|[1-9][0-9]*\.\d{0,2}))$/, message: '请输入正确的金额!'}]);
					this.$refs.form.clearValidate('taxation');
					this.$refs.form.clearValidate('taxRate');
					this.isSpecialDisabled=false;
					this.isTaxRateDisabled=true;
					this.basicForm.isSpecial_dictText='其他'
				}
				this.inputAmount()
			},
			inputAmount () {
				if(this.basicForm.taxation === null || this.basicForm.taxation === '' || this.basicForm.taxation === undefined){
					this.$set(this.basicForm,'untaxedAmount', '');
					return false
				}
				let amount = 0
				if(Number(this.basicForm.amount) && (Number(this.basicForm.taxation) || Number(this.basicForm.taxation)==0)){
					amount	=(this.basicForm.amount-this.basicForm.taxation).toFixed(2);
					if(amount>0){
						// 未税金额 = 报销金额 - 税费金额 
						this.$set(this.basicForm,'untaxedAmount',amount);
						if (this.basicForm.isSpecial == 1) {
							this.$set(this.basicForm,'taxRate',(this.basicForm.taxation/this.basicForm.untaxedAmount*100).toFixed(0));
						} else {
							this.$set(this.basicForm, 'taxRate',0);
						}
					}else{
						this.$set(this.basicForm,'untaxedAmount',0);
						this.$set(this.basicForm,'taxRate',0);
					}
				}
			},
			/* 选择合同触发 */
			contractChange(data){
				if (data) {
					this.$set(this.basicForm, 'relContractId_dictText', data.htmc) // 合同名称
				} else {
					this.$set(this.basicForm, 'relContractId_dictText', '') // 合同名称
				}
				
			},
			async onSave(){
				await this.$refs.form.validate()
				this.showNew = false
				let isEdit=false //是否是编辑
				if(this.basicForm.id){
					isEdit=true
				}else{
					isEdit=false
					this.$set(this.basicForm,'id',parseInt(Math.random() * 1000000000000))
				}
				this.$emit('confirm',this.basicForm,isEdit);
			}
		},
	}
</script>

<style lang="scss" scoped>
	@import url('@/assets/inputStyle.scss');
.title{
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: 20rpx;
}
.pop-style{
	// width: 90vw;
	height: auto;
	overflow-y: auto;
	max-height: 50vh;
	padding: 10upx 20upx;
	background-color: #fff;
}
.s-bottom{
	display: flex;
	position: fixed;
	bottom: 0px;
	left: 40%;
	height: 80upx;
}
</style>